// 登录
import Layout from '../assets/css/Logo.module.css'
import React, { useState, useEffect } from 'react'
import { Form, Input, Select, Button, message } from "antd";
import getImg from '../assets/js/getImg';
import { login } from '../api/index'
import {
  useNavigate,
  useSearchParams
} from 'react-router-dom'
export default function logo() {
  let nav = useNavigate()
  let [phone, setPhone] = useState('')
  let [pwd, setPwd] = useState('')
  let [obj, setObj] = useSearchParams()
  let path = obj.get('path') || '/';
  return (
    <Form initialValues={{ prefix: '86' }}>
      <div className={Layout.wlogo}>
        <div className={Layout.WPos}>
          <div className={Layout.WNew}>
            <img className={Layout.WLogo1} src={getImg('/src/assets/images/logo.png')} alt="" />
            <p className={Layout.WLogo1}>资产管理</p>
          </div>

        </div>
        <div className={Layout.WcenterBox}>
          <div className={Layout.WLeftBox}>
            <p className={Layout.WLogoTitle}>登录</p>
            <div className={Layout.WDis}>
              <Form.Item name="prefix" noStyle >
                <Select
                  style={{
                    width: 96,
                    height: 36
                  }}
                  className={Layout.WborNo}
                >
                  <Select.Option value="86">中国+86</Select.Option>
                  <Select.Option value="87">+87</Select.Option>
                </Select>
              </Form.Item>
              <Form.Item>
                <Input value={phone} onChange={(e) => {
                  setPhone(e.target.value)
                }} className={[Layout.WInp, Layout.Wbc]} placeholder='请输入手机号' />
              </Form.Item>
            </div>
            <Form.Item>
              <Input.Password value={pwd} onChange={(e) => {
                setPwd(e.target.value)
              }} className={[Layout.Wbc, Layout.WmB]} placeholder='请输入密码' />
            </Form.Item>
            <Button className={Layout.Wbut} onClick={() => {
              if (phone == '') {
                message.open({
                  type: 'warning',
                  content: '手机号不能为空',
                });
              } else if (pwd.length < 6) {
                message.open({
                  type: 'warning',
                  content: '密码长度至少6位',
                });
              } else {
                login({ phone, pwd }).then(res => {
                  if (res.data.data.msg == 'sucess') {
                    localStorage.setItem('token', res.data.data.token)
                    localStorage.setItem('user', res.data.data.phone)
                    localStorage.setItem('id', res.data.data.id)
                    nav(path)
                  } else {

                    message.open({
                      type: 'warning',
                      content: '账号或者密码错误',
                    });
                  }
                })
              }
            }}>登录</Button>
            <div className={Layout.WDisText}>
              <p className={Layout.Wtext} onClick={() => {
                nav('/froget')
              }}>忘记密码</p>
              <p className={Layout.Wtext} onClick={() => {
                nav('/register')
              }}>免费注册</p>
            </div>
          </div>
          <div className={Layout.WRigbox}>
            <img className={Layout.WImg} src={new URL('../assets/images/weitu1.jpg', import.meta.url).href} alt="" />
          </div >
        </div >
        <p className={Layout.WGps}>2018-2019 北京乐闻诺科技有限公司 京ICP备19041303号</p>
      </div>

    </Form >

  )
}
